<template>
	<view>
		<u-navbar :is-back="true" :border-bottom="false" title="我的发文" title-color="white"
			:background="{backgroundColor: '#00a8ff'}">
		</u-navbar>

		<view class="u-p-12">
			<u-waterfall v-model="flowList" ref="uWaterfall">
				<template v-slot:left="{leftList}">
					<view class="u-p-12" v-for="(item, index) in list1" :key="index">
						<u-lazy-load threshold="-450" border-radius="10" :image="oss+item.resource" @click="openinfo('/pages/tabBar/scienceCenter/screnceShow?id='+item.id)" :index="index">
						</u-lazy-load>
						<view class="demo-title">
							{{item.title}}
						</view>
						<view class="demo-shop">
							{{$u.timeFormat(item.createtime, 'yyyy.mm.dd')}}
							<u-icon name="more-dot-fill" color="#9b9b9b" size="34" class="u-close" @click="showPopup()">
							</u-icon>
						</view>
					</view>
				</template>
				<template v-slot:right="{rightList}">
					<view class="u-p-12" v-for="(item, index) in list2" :key="index">
						<u-lazy-load threshold="-450" border-radius="10" :image="oss+item.resource" @click="openinfo('/pages/tabBar/scienceCenter/screnceShow?id='+item.id)" :index="index">
						</u-lazy-load>
						<view class="demo-title">
							{{item.title}}
						</view>
						<view class="demo-shop">
							{{$u.timeFormat(item.createtime, 'yyyy.mm.dd')}}
							<u-icon name="more-dot-fill" color="#9b9b9b" size="34" class="u-close" @click="showPopup()">
							</u-icon>
						</view>
					</view>
				</template>
			</u-waterfall>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				oss: 'http://zjmeifeng.oss-cn-beijing.aliyuncs.com/',
				flowList: [],
				list1: [],
				list2: []
			};
		},
		onLoad() {
			this.getFawen();
		},
		methods: {
			getFawen() {
				this.$apiCoupe.mycontent({

				}).then((res) => {
					let arr = res.data.data.items;
					for(let key in arr){
						if(arr[key].resource!=null){
							// if(arr[key].resource.endsWith('，'))
							console.log(arr[key].resource.endsWith('，'));
							let array = arr[key].resource.split('，');
							console.log("array",array);
							arr[key].resource=array[0];
							console.log(arr[key].resource);
						}
					}
					let arr1 = [],
						arr2 = [];
					for (let i = 0; i < arr.length; i++) {
						if (i % 2 == 0) {
							arr1.push(arr[i]);
						} else {
							arr2.push(arr[i])
						}
					}
					console.log(arr1);
					console.log(arr2);
					this.list1 = arr1;
					this.list2 = arr2;
				}).catch((err) => {
					this.loading = false;
					console.log('request fail', err);
				});
			},
			openinfo(url) {
				uni.navigateTo({
					url: url,
				});
			},
		}
		
	}
</script>

<style lang="scss" scoped>
	.demo-title {
		font-size: 30rpx;
		margin-top: 5px;
		color: $u-main-color;
	}

	.u-close {
		float: right;
	}

	.demo-shop {
		font-size: 22rpx;
		color: $u-tips-color;
		margin-top: 5px;
	}
</style>
